<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>

<title>购物车列表</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<link rel="stylesheet" type="text/css"
	href='<c:url value="/uikit-2.25.0/css/uikit.min.css"/>'>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript"
	src='<c:url value="/uikit-2.25.0/js/uikit.min.js"/>'></script>
	

	
	
	
<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<style type="text/css">
* {
	font-size: 11pt;
}

div {
	margin: 10px;
	border: solid 2px gray;
	text-align: center;
	margin: 4px;
	padding: 6px;
	border-radius: 58%;
	height: 92px;
}

li {
	margin: 10px;
}

img {
	width: 86px;
	height: 92px;
}

#buy {
	background: url(<c:url value='/images/all.png'/>) no-repeat;
	display: inline-block;
	background-position: 0 -902px;
	margin-left: 30px;
	height: 36px;
	width: 146px;
}

#buy:HOVER {
	background: url(< c : url value = '/images/all.png'/ >) no-repeat;
	display: inline-block;
	background-position: 0 -938px;
	margin-left: 30px;
	height: 36px;
	width: 146px;
}
</style>
</head>

<body>
	<p class="uk-margin-top uk-margin-left uk-text-large uk-text-muted">购物车</p>
	<c:choose>
		<c:when test="${ fn:length(cart.cartItem) == 0 }">
			<p>
				购物车空空如也~<a href='<c:url value="/bookServlet?method=findByAllBook"/>'>请出购物</a>
			</p>
			
			<img alt="" src='<c:url value="/images/cart.png"/>' width="170px; height:124px;">
		</c:when>
		<c:otherwise>
		<a href='<c:url value="/cartServlet?method=clearCart" />'
		class="uk-button uk-button-danger uk-float-right"
		style="margin-bottom: 5px; margin-right: 1px;">清空购物车</a>
			<table border="1" width="100%" cellspacing="0" class="uk-table uk-table-hover uk-table-striped">
				<thead>
					<tr>
						<th>图片</th>
						<th>书名</th>
						<th>作者</th>
						<th>单价</th>
						<th>数量</th>
						<th>小计</th>
						<th>操作</th>
					</tr>
				</thead>
				<c:forEach items="${cart.cartItem }" var="cartItem">
					<tr class="">
						<td><div>
								<img src='<c:url value="/${ cartItem.book.image}"/>' />
							</div></td>
						<td class="uk-text-center uk-text-middle">${ cartItem.book.bname }</td>
						<td class="uk-text-center uk-text-middle">${ cartItem.book.author }</td>
						<td class="uk-text-center uk-text-middle">${ cartItem.book.price }</td>
						<td class="uk-text-center uk-text-middle">${ cartItem.count }</td>
						<td class="uk-text-center uk-text-middle">${ cartItem.subtotal}元</td>
						<td class="uk-text-center uk-text-middle"><a
							href="<c:url value='/cartServlet?method=deleteCartItem&bid=${ cartItem.book.bid }'/>"
							class="uk-button uk-button-primary">删除</a></td>
					</tr>

				</c:forEach>
				<tr>
					<td colspan="7" align="right"
						style="font-size: 15pt; font-weight: 900">合计： ${ cart.total }元</td>
				</tr>
				<tr>
					<td colspan="7" align="right"
						style="font-size: 15pt; font-weight: 900"><a id="buy"
						href="<c:url value='/orderServlet?method=saveOrder'/>"></a></td>
				</tr>
			</table>
		</c:otherwise>
	</c:choose>

</body>

</html>
